<!doctype html>
<html class="no-js" lang="en">
<!--<![endif]-->
<head>
<meta name="layout" content="common">
<title>Profile</title>
</head>
<body id="body">
	<h2>My Profile</h2>
	<hr />

	<div class="row>">
		<div class="span3">
			<h3>
				Profile Details
				<button class="btn btn-warning pull-right">
					<i class="icon-edit icon-white"></i> Edit
				</button>
			</h3>
			<br />
			<table class="table table-striped table-bordered" id="profile-tbl">
				<tr>
					<td><b>Name:</b>&nbsp; Rollei Lee</td>
				</tr>
				<tr>
					<td><b>Date of Birth:</b>&nbsp; 5 Jul 1983</td>
				</tr>
				<tr>
					<td><b>Address Line 1:</b>&nbsp; Tampines Block 164</td>
				</tr>
				<tr>
					<td><b>Address Line 2:</b>&nbsp; #10-285</td>
				</tr>
				<tr>
					<td><b>Postal Code:</b>&nbsp; 521164</td>
				</tr>
				<tr>
					<td><b>Mobile:</b>&nbsp; 521164</td>
				</tr>
				<tr>
					<td><b>Email:</b> &nbsp;lee@gmail.com</td>
				</tr>
				<tr>
					<td><b>Enable Notification:</b> &nbsp; <input type="checkbox" /></td>
				</tr>
			</table>
			<br />
		</div>
		<div class="span5">
			<h3>My Cards</h3>
			<br />
			<table class="table table-striped table-bordered" id="cards">
				<tr>
					<td></td>
					<td><b>Bank</b></td>
					<td><b>Card Number</b></td>
					<td><b>Expiry Date</b></td>
				</tr>
				<tr>
					<td><button class="btn">
							<i class="icon-edit"></i>
						</button></td>
					<td>Standard Chartered Bank</td>
					<td>5343235486759099</td>
					<td>11/2012</td>
				</tr>
				<tr>
					<td><button class="btn">
							<i class="icon-edit"></i>
						</button></td>
					<td>Citi Bank</td>
					<td>5789487345672436</td>
					<td>12/2013</td>
				</tr>
				<tr>
					<td><button class="btn">
							<i class="icon-edit"></i>
						</button></td>
					<td>JP Morgan</td>
					<td>5437654890765436</td>
					<td>09/2014</td>
				</tr>
				<tr>
					<td><button class="btn btn-warning">
							<i class="icon-plus icon-white"></i>
						</button></td>
					<td></td>
					<td></td>
					<td></td>
				</tr>
			</table>
		</div>
	</div>

	<div class="row">
		<div class="span9">
			<h2>My Subscription</h2>
			<hr />
			<div class="row">
				<div class="span2">
					<input type="checkbox" /> Fashion
				</div>
				<div class="span2">
					<input type="checkbox" /> Electronics
				</div>
				<div class="span2">
					<input type="checkbox" /> Food
				</div>
				<div class="span2">
					<input type="checkbox" /> Automobile
				</div>
			</div>
			<br />
			<div class="row">
				<div class="span2">
					<input type="checkbox" /> Watches
				</div>
				<div class="span2">
					<input type="checkbox" /> Jewelry
				</div>
				<div class="span2">
					<input type="checkbox" /> Mobile
				</div>
				<div class="span2">
					<input type="checkbox" /> Tablet
				</div>
			</div>
			<br />
			<div class="row">
				<div class="span2">
					<input type="checkbox" /> Book
				</div>
			</div>
		</div>
	</div>

	<script type="text/template" id="profile-tpl">
<tr>
<td><b>Name:</b>&nbsp; {{name}}</td>
</tr>
<tr>
<td><b>Date of Birth:</b>&nbsp; {{dob}}</td>
</tr>
<tr>
<td><b>Address Line 1:</b>&nbsp; {{address1}}</td>
</tr>
<tr>
<td><b>Address Line 2:</b>&nbsp; {{address2}}</td>
</tr>
<tr>
<td><b>Postal Code:</b>&nbsp; {{postal_code}}</td>
</tr>
<tr>
<td><b>Mobile:</b>&nbsp; {{mobile}}</td>
</tr>
<tr>
<td><b>Email:</b> &nbsp;{{email}}</td>
</tr>
<tr>
<td><b>Enable Notification:</b> &nbsp; <input type="checkbox" /></td>
</tr>
</script>

<script type="text/template" id="card-header-tpl">
<tr>
	<td></td>
	<td><b>Bank</b></td>
	<td><b>Card Number</b></td>
	<td><b>Expiry Date</b></td>
</tr>
</script>

<script type="text/template" id="card-tpl">
<td><button class="btn">
		<i class="icon-edit"></i>
	</button></td>
<td>{{name}}</td>
<td>{{number}}</td>
<td>{{expiryDate}}</td>

</script>
<script type="text/template" id="card-footer-tpl">
<tr>
	<td><button class="btn btn-warning">
	<i class="icon-plus icon-white"></i>
	</button></td>
	<td></td>
	<td></td>
	<td></td>
</tr>

</script>
	<script src="${resource(dir:'js/app', file:'profile_mod.js') }"></script>
</body>
</html>